import React, { useEffect, useState } from 'react'
import axios from 'axios'

export default function App() {
    // 定义一个存储结果的状态
    const [items, setItems] = useState([])
    const [isLoading, setIsLoading] = useState(true)

    // 调用接口
    useEffect(() => {
        axios.get('https://api.github.com/search/repositories?q=react&sort=stars')
            .then(value => {
                setItems(value.data.items)
                setIsLoading(false)
            })
    }, [])

    return (
        <div>
            {
                isLoading ? <h3>正在加载中</h3> : items.map((item)=>{
                    return <p key={item.id}>{item.full_name}</p>
                })
            }
        </div>
    )
}


